<template>
	<div class="vue_app GoodsForSF" style="position: relative;width: 100%;">
		<div v-show="isShare != 1">
			<m-header :title="Title" :hasTitle="true" :hasBack="true" :hasCart="true">
				<Share :url="shareUrl()" style="right: 3rem;z-index: 100;"></Share>
			</m-header>
		</div>
		<div class="overhid" :style="`height: ${screenHeight}px`">
			<vertical-scroll ref='verticalScroll' :bounce="true">
				<div :style="`background-color: ${Bgcolor}`">
					<header-container>
						<component 
							v-for="(item, index) in getRealComponentsList[0][0]" 
							v-sdrag="{componentName: item.componentName, handleType: 'sort', index}" 
							:is="item.componentName" 
							:key="index" 
							:config="item" 
							:data-id="item.id" 
							:dataList="dataStore[item.componentName][item.id]" 
							:copolddataobj="copolddata" 
							:part="0">
						</component>
					</header-container>
					<content-container>
						<component 
							v-for="(item, index) in getRealComponentsList[0][1]" 
							v-sdrag="{componentName: item.componentName, handleType: 'sort', index}" 
							:is="item.componentName" 
							:key="index" 
							:config="item" 
							:data-id="item.id" 
							:dataList="dataStore[item.componentName][item.id]" 
							:copolddataobj="copolddata" 
							:part="1">
						</component>
					</content-container>
				</div>

			</vertical-scroll>
		</div>
		<button-to-top @goTop="goTop"></button-to-top>
		<add-cart-animate></add-cart-animate>
	</div>
</template>
<script>
	//引用包裹“真实-基础组件”的组件
	import HeaderContainer from "../../real-components/HeaderContainer";
	import ContentContainer from "../../real-components/ContentContainer";
	import VerticalScroll from '../../real-components/VerticalScroll';
	import ButtonToTop from '../../real-components/ButtonToTopForTest';
	import AddCartAnimate from "../../real-components/AddCartAnimate";
	import Header from "../header";
	//引用真实-基础组件
	import UserCard from "../../real-components/UserCard/_index";
	import NewZone from "../../real-components/NewZone/_index";
	import GuessYouLike from "../../real-components/GuessYouLike/_index";
	import HomeCarousel from "../../real-components/HomeCarousel/_index";
	import activitiesbanner from "../../real-components/activitiesbanner/_index";
	import activitiesThreePic from "../../real-components/activitiesThreePic/_index";
	import activitiesSlidePic from "../../real-components/activitiesSlidePic/_index";
	import activitiesTwoPro from "../../real-components/activitiesTwoPro/_index";
	import activitiesOnePro from "../../real-components/activitiesOnePro/_index";
	import activitiesNinePro from "../../real-components/activitiesNinePro/_index";
	import ActivitieCoupons from "../../real-components/ActivitieCoupons/_index";
	import ActivitieCoupons2 from "../../real-components/ActivitieCoupons2/_index";
	//引用util文件
	import getPageName from "../../utils/getPageName";
	import { mapGetters, mapMutations } from "vuex";
	import axios from "axios";
	// import initData from "../../edit-containers/Activities2/axios.js";
	import Share from "../../real-components/Share";
	import initData, {baseComponentNames} from "../../utils/lxn/handleData";
	export default {
		data() {
			return {
				Bgcolor: "",
				Title: "",
				//判断是否为分享的页面
				isShare: 0,
				//优惠券的实时更新信息
				copolddata: {},
				flagfresh: true
			}
		},
		computed: {
			...mapGetters("xxy", {
				dataStore: "getDataStore"
			}),
			...mapGetters("gw", [
				"getRealComponentsList"
			]),
			pageName() {
				return getPageName();
			},
			pageConfig() {
				return this.$store.getters['gw/getRealComponentsList']
			},
			screenHeight() {
				if(this.isShare == 1) {
					return window.innerHeight;
				} else {
					return window.innerHeight - '60';
				}
			},
			env() {
				return window.environment;
			},
		},
		methods: {
			//回到顶部
			goTop() {
				this.$refs.verticalScroll.goTop()
			},
			getsessionIddata() {
				this.sessionIddata = localStorage.getItem('sessionId');
				this.storeCodedata = localStorage.getItem('storeCode');
				if(this.pageConfig[1]) {
					this.Bgcolor = this.pageConfig[1].activitiesBgcolor;
					this.Title = this.pageConfig[1].activitiesTitle;
				}
			},
			//优惠券信息对比
			queryCoupons3() {
				var sessionId = localStorage.getItem('sessionId');
				let url = api.trade_host + '/marketCenter/getDiffReleasedCoupons/' + api.enterpriseCode;
				let config = {
					url: url,
					method: 'GET',
					headers: {
						'sessionId': sessionId,
					},
				};
				axios(config).then((res) => {
					this.copolddata = res.data.data[0]
				})
			},
			//初始化监听数据变化
			inite() {
				PSEvent.listen("changeStoreCode", () => {
					this.getsessionIddata();
					this.getactData(true);
				});
				PSEvent.listen("BgcolorUpdate", () => {
					this.getsessionIddata()
				});
			},
			removeListen() {
				PSEvent.remove("changeStoreCode");
				PSEvent.remove("BgcolorUpdate");
				PSEvent.remove("dataRefresh", this.dataRefresh);
			},

			//分享链接
			shareUrl() {
				/*let str = JSON.stringify(location.href + '&share=1');*/
				return `${location.href}?share=1`;
			},
			//下拉刷新
			dataRefresh() {
				if(this.flagfresh) {
					this.flagfresh = false
					this.getactData(true);//下拉强制刷新调用接口
					this.queryCoupons3();
					this.getTemplate()
				}
				setTimeout(() => {
					this.flagfresh = true
					window.PSEvent.trigger('pageLoadedOver')
				}, 1200)
			},
			//获取当前模板信息
			getTemplate() {
				let url = api.base_host + '/common/selectTemplateByStoreCode/' + this.storeCodedata;
				let config = {
					url: url,
					method: 'GET',
					headers: {
						sessionId: localStorage.getItem('sessionId')
					}
				};
				axios(config).then((res) => {
					console.log('55555555555', res)
					/*this.$store.commit('setConfigParams', Object.assign(
						this.$store.getters.getConfigParams, {
							templateConfigList: res.data.data
						}
					));*/
				});
			},
			//取缓存的数据来请求数据
			getactData(isRefresh = false) {
				initData(isRefresh);
			}
		},
		components: {
			"m-header": Header,
			"vertical-scroll": VerticalScroll,
			HeaderContainer,
			ContentContainer,
			ButtonToTop,
			AddCartAnimate,
			Share,
			UserCard,
			NewZone,
			'activitiesbanner': activitiesbanner,
			'activitiesThreePic': activitiesThreePic,
			'activitiesSlidePic': activitiesSlidePic,
			'activitiesTwoPro': activitiesTwoPro,
			'activitiesNinePro': activitiesNinePro,
			'activitiesOnePro': activitiesOnePro,
			'ActivitieCoupons': ActivitieCoupons,
			'ActivitieCoupons2': ActivitieCoupons2,
			GuessYouLike,
			HomeCarousel,
		},
		created() {
			window.PSEvent.listen('dataRefresh', this.dataRefresh)
		},
		mounted() {
			this.isShare = this.$route.query.share;
			this.queryCoupons3();
			this.inite();
			this.getsessionIddata();
			this.getactData()
			if(this.isShare == 1 && this.Title) {
				document.getElementsByTagName("title")[0].innerText = this.Title
			}
		},
		updated() {
			this.$nextTick(() => {
				setTimeout(() => {
					this.$refs.verticalScroll && this.$refs.verticalScroll.refresh();
				}, 500)
			});
		},
		beforeDestroy() {
			this.removeListen()
		},
		beforeRouteLeave(to, from, next) {
			var name = from.name;
			this.$store.commit('cjy/SET_RETURN_POS', name);
			next();
		},
	}
</script>
<style>
	.overhid {
		overflow: hidden;
	}
	
	.GoodsForSF .cjy-center {
		top: 0px !important;
	}
</style>